import 'babel-polyfill';
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, IndexRoute, Link } from '$router';
import HomePage from './home';
import yoHistory from '../common/history';

const Obj = require.async('./obj');
const Detail = require.async('./detail');
const Expire = require.async('./expire');
const Skill = require.async('./skill');
const My = require.async('./my');

const Root = () => (
    <Router history={yoHistory}>
        <Route path="/" onlyActiveOnIndex component={HomePage}>
            <IndexRoute getComponent={Skill}></IndexRoute>
            <Route path="/skill/:sel" getComponent={Skill}/>
            <Route path="/my/:sel" getComponent={My}/>
            <Route path="/obj" getComponent={Obj}></Route>
            <Route path="/detail" getComponent={Detail}/>
            <Route path="/expire" getComponent={Expire}/>
        </Route>
        {/* <Route path='/list' component={List}/> */}
    </Router>
);

ReactDOM.render(<Root />, document.getElementById('root'));
